<template>
  <div class="top"></div>
</template>

<script>
export default {
  name: "LoadTexts",
  props: {
    title: {
      default: "1111",
      require: true,
    },
    time:{
      
    }
  },
  data() {
    return {
      timer: null,
    };
  },
  mounted() {
    // console.log(content.length);
    let index = -1;
    this.timer = setInterval(() => {
      if (index < this.title.length - 1) {
        index++;
        document.querySelector(".top").innerHTML += this.title.charAt(index);
      } else {
        clearInterval(this.timer);
      }
    }, this.time);
  },
};
</script>

<style>
.top {
  border: 1px solid #ccc;
  width: 350px;
  /* height: 40px; */
  /* padding: 0 10px; */
  border-radius: 20px;
  padding: 10px;
  margin: 10px;
  /* overflow-y: scroll; */
}
</style>
